<template>
  <div class="post">
      <!-- 侧边栏 -->
      <el-row type="flex">
            <el-row class="aside">
            <el-col>
              <asideNav />
            </el-col>
            <el-col class="recCity">
                  推荐城市
                  <div class="recImg"></div>
            </el-col>
          </el-row>
          <el-row style="margin-left:20px">
            <!-- 上方搜索 -->
            <Middlecontent />
          </el-row>
      </el-row>
  </div>
</template>

<script>
import asideNav from '../../components/post/asideNav'
import Middlecontent from '../../components/post/content'
export default {
  components: {
    asideNav,
    Middlecontent
  }
}
</script>

<style lang="less" scoped>
.post{
  width: 1000px;
  margin:0 auto;
  padding: 20px;
  .aside{
    width: 260px;
    min-height: 400px;
    .recCity{
      position: relative;
      width: 230px;
      margin-top: 15px;
      &::before{
        position: absolute;
        top: 20px;
        content: '';
        display: block;
        height: 1px;
        width: 230px;
        background-color: #eee;
      }
      .recImg{
        position: absolute;
        top: 50px;
        width: 100%;
        height: 150px;
        background-color: orange;
      }
    }
  }
}
</style>
